<template>
  <div>
    <div class="bread">
      当前位置：
      <span @click="GoTips" class="break">网上举报 ></span>
      <span class="color-blue">实名认证</span>
    </div>
    <div class="report-body">
      <div>
        <img :src="smrzPic" alt />
      </div>
      <!--中间body部分-->
      <div class="report-text">
        <div class="speed">
          <img :src="gouPic" alt />
          <span class="speed-text">安全设置</span>
          <span class="speed-xian"></span>
          <span class="speed-round">2</span>
          <span class="speed-success">认证完成</span>
        </div>
        <div class="report-between">
          <div>
            <img :src="groupPic" alt />
          </div>
          <div class="between-txt-1">实名认证成功</div>
          <div class="between-txt-2">认证信息</div>
          <div class="between-txt-3 line-he">姓名：{{username}}</div>
          <div class="between-txt-3 line-he">身份证号：{{userID}}</div>
          <div class="between-txt-3 line-he">认证方式：银行卡认证/身份证认证</div>
          <div>
            <div type="button" class="text-input-button" @click="GoSign" v-on:keyup.enter="GoSign">
              <span class="text-button-text">继续举报</span>
            </div>
          </div>
        </div>
      </div>

      <!--<Start-verification></Start-verification>-->
    </div>
  </div>
</template>
<script>
import StartVerification from "@/components/SigndeReport/StartVerification.vue";
export default {
  components: {
    StartVerification
  },
  data() {
    return {
      smrzPic: require("@/assets/image/wsjb-smrz-1.png"),
      gouPic: require("@/assets/image/gou.png"),
      groupPic: require("@/assets/image/Group.png"),
      username:sessionStorage.getItem("username"),
      userID:sessionStorage.getItem("userID")

    };
  },
  methods: {
    GoTips() {
      this.$router.push({ name: "Tips" });
    },
    GoSign() {
      let ruleForm=this.$route.params.ruleForm
      this.$router.push({ name: "Sign" ,params:{ruleForm:ruleForm} });
    }
  },
  created(){
    
    let g =this
    document.onkeydown=function(e){
      let key =window.event.keyCode;
      if(key==13){
        g.GoSign()
      }
    }
  },
};
</script>
<style lang="less" scoped>
.bread {
  font-size: 14px;
  font-family: PingFangSC-Regular, PingFang SC;
  font-weight: 400;
  color: rgba(102, 102, 102, 1);
  line-height: 62px;
  background: rgba(242, 242, 242, 1);
}
.color-blue {
  color: #0074dd;
}
.break:hover {
  color: red;
  cursor: pointer;
}
.report-body {
  padding: 54px 40px;
  min-height: 702px;
}
/**body部分代码可抽成组件 */
.report-text {
  width: 624px;
  margin: 0 auto;
  margin-top: 81px;
}
.speed {
  display: flex;
  align-items: center;
}
.speed span {
  display: inline-block;
}
.speed-text {
  width: 64px;
  height: 24px;
  font-size: 16px;
  font-family: PingFangSC-Regular, PingFang SC;
  font-weight: 400;
  color: rgba(102, 102, 102, 1);
  margin-left: 8px;
  margin-right: 16px;
}
.speed-xian {
  width: 383px;
  height: 1px;
  background: rgba(22, 119, 255, 1);
}
.speed-round {
  border-radius: 50%;
  width: 32px;
  height: 32px;
  background: rgba(22, 119, 255, 1);
  text-align: center;
  line-height: 32px;
  margin: 0 17px 0 8px;
}
.speed-success {
  width: 64px;
  height: 24px;
  font-size: 16px;
  font-family: PingFangSC-Medium, PingFang SC;
  font-weight: 500;
  color: rgba(51, 51, 51, 1);
  line-height: 24px;
}
//中间部分
.report-between {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-top: 60px;
}
.between-txt-1 {
  font-size: 20px;
  font-family: PingFangSC-Medium, PingFang SC;
  font-weight: 500;
  color: rgba(51, 51, 51, 1);
  line-height: 68px;
}
.between-txt-2 {
  font-size: 18px;
  font-family: PingFangSC-Medium, PingFang SC;
  font-weight: 500;
  color: rgba(51, 51, 51, 1);
  margin-bottom: 15px;

}
.line-he{
    line-height: 32px;
    font-size:16px;
    font-weight:400;
    color:rgba(102,102,102,1);
}
//按钮部分
.text-input-button {
  display: inline-block;
  width: 234px;
  height: 52px;
  background: rgba(20, 123, 253, 1);
  box-shadow: 0px 4px 12px 0px rgba(20, 123, 253, 0.6);
  border-radius: 5px;
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
  margin-top: 42px;
}
.text-button-text {
  font-size: 20px;
  font-family: PingFangSC-Medium, PingFang SC;
  font-weight: 500;
  color: rgba(255, 255, 255, 1);
  line-height: 28px;
  margin-left: 8px;
}
</style>